<div class="pd14 vany_authority">
	<link rel="stylesheet" href="templates/authority/zzgl/css/authority.css" />
	<link rel="stylesheet" href="templates/authority/yhfl/css/userClassification.css" />
	<link rel="stylesheet" href="templates/authority/common/css/zTreeStyle.css" />
	<link rel="stylesheet" href="templates/authority/common/css/cropper.css" />
	<div class="vany_treeTable pd14" id="authority">
		<!--面包屑-->
		<div class="pb10" id="crumbs">
			<el-breadcrumb separator="/">
				<el-breadcrumb-item :to="{ path: '/' }">组织权限</el-breadcrumb-item>
				<el-breadcrumb-item>用户分类</el-breadcrumb-item>
			</el-breadcrumb>
		</div>
		<div id="treeTable" class="treeTable">
			<!--树-->
			<div class="item i1 vany_tree" id="move_left">
				<div class="relative">
					<div class="treetab">
						<ul class="thisTitle">
							<li class="active">公共分类</li>
							<li>我的分类</li>
						</ul>
						<div class="treetabcon">
							<div class="pd14">
								<div class="search-bar">
									<input type="text" id="key" value="" class="empty" placeholder="请输入关键字搜索" />
									<i class="el-input__icon el-icon-search"></i>
								</div>
							</div>
							<div class="treeTitle" id="treeTitle">
								<i class="iconfont">&#xe7a1;</i><span class="title">公共分类</span>
								<div class="floatR">
									<div id="floatR1"><i class="iconfont icon-jia addRole" @click="titleOperation"></i></div>
									<div id="floatR2" style="display: none;"><i class="iconfont icon-jia addRole" @click="titleOperationMine"></i></div>
								</div>
								<div class="chooseShow" id="titleOperation">
									<ul>
										<li authority="base_tag_addBaseRootTag">
											<el-button type="text" @click="addTitle">添加公共分类</el-button>
										</li>
									</ul>
								</div>
								<div class="chooseShow" id="titleOperationMine" style="display: none;">
									<ul>
										<li authority="base_tag_addRootTag">
											<el-button type="text" @click="addTitle">添加我的分类</el-button>
										</li>
									</ul>
								</div>
							</div>
							<ul id="treeDemo" class="ztree"></ul>
						</div>
					</div>
					<div class="moveline"></div>
				</div>
			</div>
			<!--表格-->
			<div class="item i2" id="table">
				<div class="pd14">
					<el-row :gutter="8">
						<el-col :span="12">
							<el-row :gutter="8">
								<el-col :span="12">
									<el-input v-model="searchContent" @change="restoreTableData" @keyup.enter.native="searchTable" :on-icon-click="searchTable" placeholder="请输入您要搜索的内容" icon="search">
									</el-input>
								</el-col>
							</el-row>
						</el-col>
						<el-col :span="12">
							<el-row type="flex" class="row-bg qxBtn" justify="end">
								<el-button type="primary" @click="openPersonFilter" authority="base_tag_selectTagUser">添加人员</el-button>
								<el-button type="primary" @click="Batchexport" authority="base_tagUser_export">批量导出</el-button>
							</el-row>
						</el-col>
					</el-row>
				</div>

				<el-table ref="table" :data="tableData" v-loading="listLoading" @selection-change="selsChange" highlight-current-row style="width: 100%;" :height="tableHeight" @row-click="showPersonCard">
					<el-table-column type="selection"> </el-table-column>
					<el-table-column prop="userAccount" show-overflow-tooltip label="账号">
					</el-table-column>
					<el-table-column prop="userName" show-overflow-tooltip label="姓名" width="120">
						<template scope="scope">
							<img :src="scope.row.photoUrl" onerror="nofindImg(this);" /> {{ scope.row.userName }}
						</template>
					</el-table-column>
					<el-table-column prop="genderStr" label="性别" width="80">
					</el-table-column>
					<el-table-column prop="dept" show-overflow-tooltip label="部门" width="240">
					</el-table-column>
					<el-table-column prop="mobile" show-overflow-tooltip label="手机号">
					</el-table-column>
					<el-table-column prop="email" show-overflow-tooltip label="邮箱">
					</el-table-column>
					<!-- <el-table-column column-key="status" prop="State" show-overflow-tooltip label="状态" :filters="filters" :filter-multiple="false" :filter-method="filterTag" filter-placement="bottom-end"> -->
					<el-table-column column-key="status" prop="State" show-overflow-tooltip label="状态">
						<template scope="scope">
							<div v-if="scope.row.status === '1'">
								启用
							</div>
							<div v-else>
								<div style="color:#ff0000;">禁用</div>
							</div>
						</template>
					</el-table-column>
				</el-table>
			</div>
			<!--批量选择-->
			<div id="multiSelectPerson" v-bind:class="{isIE: isIE}">
				<el-dialog top="top" ref="dialog" :modal="false" v-model="multiSelectPersonVisible" size="tiny" custom-class="right_dialog title_dialog" @close="removeFromSeleted">
					<span slot="title" class="el-dialog__title" v-text="title"></span>
					<div class="seleted_persons">
						<div class="seleted_person" v-for="(seletedPerson, rowindex) in seletedPersons">
							<img :src="seletedPerson.photoUrl" width="60" height="60" onerror="nofindImg(this);" />
							<p v-text="seletedPerson.userName"></p>
							<span class="remove_from_seleted" @click="removeFromSeleted(rowindex)">╳</span>
						</div>
					</div>
					<span slot="footer" class="dialog-footer qxBtn">
    					<!-- <el-button @click="moveSeletedPerson">移动</el-button> -->
    					<el-button type="danger" @click="deleteSeletedPerson" authority="base_tag_deleteTagUser">删除</el-button>
  					</span>
				</el-dialog>
			</div>
			<!--树的下拉-->
			<div id="rMenu">
				<div id="rMenugongg" class="allShow">
					<ul>
						<li id="m_add" authority="base_tag_addBaseTag">
							<el-button type="text" @click="add">添加子分类</el-button>
						</li>
						<li id="m_edit" authority="base_tag_modifyBaseTag">
							<el-button type="text" @click="Edit">修改名称</el-button>
						</li>
						<li id="m_del" authority="base_tag_deleteBaseTag">
							<el-button type="text" @click="del">删除</el-button>
						</li>
					</ul>
				</div>

				<div id="rMenuMine" class="allShow" style="display: none;">
					<ul>
						<li id="m_add" authority="base_tag_addTag">
							<el-button type="text" @click="add">添加子分类</el-button>
						</li>
						<li id="m_edit" authority="base_tag_modifyTag">
							<el-button type="text" @click="Edit">修改名称</el-button>
						</li>
						<li id="m_del" authority="base_tag_deleteTag">
							<el-button type="text" @click="del">删除</el-button>
						</li>
					</ul>
				</div>
			</div>
			<!--添加子部门-->
			<div id="addRole" class="movedialog">
				<el-dialog v-model="treeAddVisible" title="添加分类" size="small" custom-class="border_dialog title_dialog">
					<el-form :label-position="labelPosition" :model="ruleForm" :rules="rules" ref="ruleForm" label-width="140px">
						<el-form-item label="分类名称" prop="tagName">
							<el-input v-model="ruleForm.tagName" placeholder="请输入分类名称"></el-input>
						</el-form-item>
					</el-form>
					<div slot="footer" class="dialog-footer">
						<el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>
					</div>
				</el-dialog>
			</div>
			<!--树修改-->
			<div id="treeEdit" class="movedialog">
				<el-dialog v-model="treeEditVisible" title="修改分类名称" size="small" custom-class="border_dialog title_dialog">
					<el-form :label-position="labelPosition" :model="ruleForm" :rules="rules" ref="ruleForm" label-width="140px">
						<el-form-item label="分类名称" prop="tagName">
							<el-input v-model="ruleForm.tagName" placeholder="请输入分类名称"></el-input>
						</el-form-item>
					</el-form>
					<div slot="footer" class="dialog-footer">
						<el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>
					</div>
				</el-dialog>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript" src="templates/authority/common/js/jquery.ztree.all.min.js"></script>
<script type="text/javascript" src="templates/authority/common/js/jquery.ztree.exhide.min.js"></script>
<script type="text/javascript" src="templates/authority/common/js/VanyBaseTree.js?ts=new Date().getTime()"></script>
<script type="text/javascript" src="templates/authority/common/js/VanyEditTree.js?ts=new Date().getTime()"></script>
<script type="text/javascript" src="templates/authority/yhfl/js/userClassification.js?ts=new Date().getTime()"></script>
<script type="text/javascript" src="templates/authority/common/js/cropper.js"></script>
<script type="text/javascript" src="templates/authority/common/js/moveline.js"></script>